import React from 'react';
import { createForm } from 'rc-form';
import { render } from 'react-dom';
import constants from '../../../common/constants';
import MyCarousel from './carousel';
import MenuItem from './menuItem';
import GoodsGrid from './goodsGrid';
import './less/index.less';

const titleBg = constants.titleBg;
const homeScan = constants.honeScan;
const homeMassage = constants.homeMassage;

class Main extends React.Component{

    render(){
        return (
            <div>
                {/*<Profile name="hhh" age={22}/>*/}
                <div style={{position:'relative'}}>
                    {/*<Head />*/}
                    <MyCarousel data={constants.headImg}/>
                    <div className="toolDiv">
                        <div
                            style={{float:'left',marginTop:'15px',marginLeft:'3%',width:'6%',height:'80%'}}>
                            <img src={homeScan} style={{width:'100%',height:'100%'}}/>
                        </div>
                        <div className="text boder-radius">
                            <input type="text" placeholder="热门路由器" />
                        </div>
                        <div style={{float:'left',marginTop:'15px',marginLeft:'3%',width:'6%',height:'80%'}}>
                            <img src={homeMassage} style={{width:'100%',height:'100%'}}/>
                        </div>
                    </div>
                </div>
                <MenuItem />
                <div  className="titleText">
                    <span style={{backgroundImage:`url(${titleBg})`,color:'#ffc30e'}}>金  牌  优  选</span></div>
                <GoodsGrid columnNum={2} data={constants.preference} type={0}/>
                <div className="spaceDiv"></div>
                <div className="titleText" ><span style={{backgroundImage:`url(${titleBg})`}}>热  销  光  猫</span></div>
                <GoodsGrid columnNum={2} data={constants.preference} type={0}/>
                <div className="spaceDiv"></div>
                <div className="titleText"><span style={{backgroundImage:`url(${titleBg})`}}>爆  款  路  由</span></div>
                <GoodsGrid columnNum={2} data={constants.preference} type={0}/>
                <div style={{ padding: 10, textAlign: 'center',marginBottom:'90px',marginTop:'10px',color:'#8B8B8B' }}>
                    没有更多了～
                </div>
            </div>
        )
    }
}
export default Main;